import G6 from "@antv/g6";
const MenuList = [
  {
    title: "build_object",
    text: "新建对象类型",
    isNode: true,
    isLine: true,
  },
  {
    title: "copy_object",
    text: "复制对象类型",
    isCanvas: true,
    isLine: true,
  },
  // {
  //   title: "build_relation",
  //   text: "新建关系",
  //   isCanvas: true,
  //   isLine: true,
  // },
  {
    type: "line",
  },
  {
    title: "edit",
    text: "编辑",
    isCanvas: true,
  },
  {
    title: "delete",
    text: "删除",
    isCanvas: true,
  },
  {
    type: "line",
  },
  {
    title: "all_concept",
    text: "选择所有对象类型",
  },
  {
    title: "all_relation",
    text: "选择所有关系类型",
  },
  {
    title: "all_choose",
    text: "全选",
  },
];
import { forEach } from "loadsh";
import {
  handleBuildObject,
  handleCopyObject,
  handleDeleteObject,
  handleBuildRelation,
  handleEditObject,
  handleAllConcept,
  handleAllChoose,
  handleAllRelation,
} from "./menuEvent";
let currentEvt = {};
export const createMenu: any = () => {
  const menu = new G6.Menu({
    className: "custom-menu-bar",
    getContent(evt) {
      //表示画布上
      let menuHtml = "";
      currentEvt = evt;
      if (evt.target && evt.target.isCanvas && evt.target.isCanvas()) {
        forEach(MenuList, (item) => {
          const disabel = item.isCanvas ? "disabel" : "";
          getMenuHtml(item, disabel);
        });
        //表示节点上
      } else if (evt.item && evt.item.getType().toUpperCase() === "NODE") {
        forEach(MenuList, (item) => {
          const disabel = item.isNode ? "disabel" : "";
          getMenuHtml(item, disabel);
        });
      } else if (evt.item && evt.item.getType().toUpperCase() === "EDGE") {
        forEach(MenuList, (item) => {
          const disabel = item.isLine ? "disabel" : "";
          getMenuHtml(item, disabel);
        });
      }
      function getMenuHtml(item, disabel) {
        menuHtml +=
          item.type != "line"
            ? `<li class='flex justify-center items-center text-sm hover:text-[#2C51D7]
           hover:bg-[#E9E9EB] h-8 cursor-pointer ${disabel}' titles="${item.title}">
            ${item.text}
           </li>`
            : `<li class="line"></li>`;
      }
      return `<ul class='w-32'>
        ${menuHtml}
      </ul>`;
    },
    handleMenuClick: (target) => {
      const titles = target.getAttribute("titles");
      switch (titles) {
        case "build_object":
          handleBuildObject(currentEvt);
          break;
        case "copy_object":
          handleCopyObject(currentEvt);
          break;
        case "delete":
          handleDeleteObject(currentEvt);
          break;
        case "build_relation":
          handleBuildRelation(currentEvt);
          break;
        case "edit":
          handleEditObject(currentEvt);
          break;
        case "all_concept":
          handleAllConcept();
          break;
        case "all_relation":
          handleAllRelation();
          break;
        case "all_choose":
          handleAllChoose();
          break;
        default:
          break;
      }
    },
    itemTypes: ["node", "canvas", "edge"],
  });
  return menu;
};
